@import './base.scss';
.listContent {
  min-height: calc(100vh - 30px);
}
.list-wrap {
  @include border-box(relative, 100%, auto, 1);
  // min-height: calc(100vh - 30px);
  // padding-bottom: 80px;
  background-color: rgb(246, 246, 246);

  // 元素
  >.list-item {
    @include border-box(relative, 100%, auto, 1);
    margin-bottom: 30px;
    background: #fff;

    border: {
      top: 1px solid rgb(235, 235, 235);
      bottom: 1px solid rgb(235, 235, 235);
    }

    // 头部
    .list-header {
      @include border-box(relative, 100%, 80px, 1);
      @include flex-box(space-between, center, row, nowrap);
      padding-right: 30px;
      background: #fafafa;
      line-height: 80px;
      padding-left: 28px;

      // 编号
      >.code {
        @include border-box(relative, auto, auto, 1);
        @include font-box(28px, normal, rgb(0, 0, 0));
        letter-spacing: 1px;
        padding-left: calc(28px + 16px);
        max-width: 70%;
        overflow: hidden;
        text-overflow: ellipsis;
        &::after {
          position: absolute;
          top: calc(50% - 8px);
          left: 0;
          display: inline-block;
          width: 16px;
          height: 16px;
          border-radius: 50%;
          background: rgb(47, 132, 254);
          content: "";
          margin-right: 28px;
        }
      }

      // 详情
      >.go {
        @include border-box(relative, auto, auto, 1);
        @include font-box(28px, normal, rgb(155, 155, 155));
        @include flex-box(flex-start, center, row, nowrap);

        >span {
          display: inline-block;
          margin-right: 12px;
        }

        // .red {
        //   color: #3083ff;
        // }
        // .blue {
        //   color: #ff434a;
        // }
      }
    }

    // 内容
    .list-content {
      @include border-box(relative, 100%, auto, 1);

      padding: 0 25px;
      background: #fff;
      // 内容
      >.content {
        @include border-box(relative, 100%, auto, 1);
        padding: 24px 0;
        border-top: 1px solid rgb(214, 214, 214);

        >.list-line {
          @include border-box(relative, 100%, auto, 1);
          @include flex-box(flex-start, center, row, nowrap);
          margin-bottom: 14px;
          align-items: flex-start;
          height: 48px;
          &:last-child {
            margin: 0;
          }

          >.line-item {
            @include border-box(relative, 100%, auto, 1);
            @include font-box(28px, normal, rgb(51, 51, 51));
            @include flex-box(flex-start, center, row, nowrap);
            letter-spacing: 1px;
            align-items: flex-start;
            height: 48px;
            // 名称
            &.name {
              width: 50%;

              >.value {
                @include border-box(relative, 50%, auto, 1);
                display: inline-block;
              }
            }

            // 金额
            &.price {
              width: 55%;

              >.value {
                @include border-box(relative, 60%, auto, 1);
                display: inline-block;
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
              }
            }

            // 标题
            >.title {
              flex-shrink: 0;
              color: rgb(155, 155, 155);
              line-height: 48px;
            }

            // 内容
            >.value {
              color: rgb(0, 0, 0);
              white-space: nowrap;
              text-overflow: ellipsis;
              // word-break: break-all;
              overflow: hidden;
              line-height: 48px;
              font-size: 28px;
            }
          }
        }
      }
    }
  }

  // 加载
  >.van-list__loading {
    top: -30px;
  }
}